const ExtractTextPlugin = require("extract-text-webpack-plugin");
const webpack = require('webpack');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const path = require('path');

module.exports = function (env) {
    return {
        entry: __dirname + "/src/index.ts",
        devtool: "source-map",
        devServer: {
            contentBase: "./static", //本地服务器所加载的页面所在的目录
            historyApiFallback: true, //不跳转
            inline: true //实时刷新
        },
        output: {
            path: __dirname + "/dist", //打包后的文件存放的地方
            filename: "bundle.js" //打包后输出文件的文件名
        },
        module: {
            rules: [{
                    test: /\.vue$/,
                    loader: 'vue-loader'
                },
                {
                    test: /\.js$/,
                    use: {
                        loader: "babel-loader"
                    },
                    exclude:/node_modules/
                },
                {
                  test: /\.ts$/,
                  exclude: /node_modules|vue\/src/,
                  loader: 'ts-loader',
                  options: {
                    appendTsSuffixTo: [/\.vue$/]
                  }
                },
                {
                    test: /\.(less|css)$/,
                    use: ExtractTextPlugin.extract({
                        fallback: "style-loader",
                        use: "css-loader?modules=true!postcss-loader!less-loader"
                    }),
                    exclude: [/node_modules/, path.resolve(__dirname, "./src/css/common.less")]
                },
                {
                    test: /\.(woff|ttf|eot|svg)(\?v=[0-9]\.[0-9]\.[0-9])?$/,
                    loader: "url-loader?name=css/[name].[ext]"
                },
                {
                    test: /\.(png|jpe?g|svg)$/i,
                    loaders: [
                        'url-loader?limit=8192&name=img/[name].[hash].[ext]'
                    ]
                }
            ]
        },
        resolve: {
            alias: {
                'vue$': 'vue/dist/vue.esm.js'
            }
        },
        externals: {
            vue: "Vue",
            "vue-router": "VueRouter"
        },
        plugins:[
            new HtmlWebpackPlugin({
                template: path.join(__dirname , "./src/index.ejs"),//new 一个这个插件的实例，并传入相关的参数
                title:"业务测试主页面",
                filename:"index.html"
            })
        ]
    }
}